<template>
	<view>
		<view class="bg">
			<view class="pay-box">
				<!-- 个人信息 -->
				<!-- 路由传值修改收货选项 -->
				<view class="person">
						<view class="personal">
							<view class="pers">
								<view v-if="address" class="personal" style="font-size: 38rpx; font-weight: 500;padding: 60rpx 20rpx;">
									暂时没有收货地址，请添加
								</view>
								<view v-else class="name">{{userName}}</view>
								<view class="phone">{{telNumber}}</view>
							</view>
							<view class="addr">
								<image src="http://yunzhidun.oss-cn-beijing.aliyuncs.com/weixin/static/shop/location.png" mode="widthFix" class="locat"></image>
								<view class="address">{{provinceName}}{{cityName}}{{countyName}}{{detailInfo}}</view>
							</view>
						</view>
					<image src="http://yunzhidun.oss-cn-beijing.aliyuncs.com/weixin/static/equipment/arrow.png" mode="widthFix" class="icon"></image>
					
				</view>
				<view class="zhmx"  @click="chooseAddress()">
					<image src="../../static/tjdz.png" mode="widthFix" class="tj"></image>
					<text style="color: #FFFFFF;margin-left: 20rpx;">请添加收货地址</text>
				</view>
				<!-- 商品信息 -->
				
				<view class="list">
					<view class="goods-con">
						<image :src='infoImg' mode="widthFix" class="goods-pic"></image>
						<view class="text">
							<view class="goods-title">{{list.title}}</view>
							<view class="goods-chooes">{{list.content}}</view>
							<view class="goods-bott">
								<view class="goods-price">￥{{price}}</view>
								<view class="goods-num">X{{num}}</view>
							</view>
						</view>
					</view>
				</view>
				
			</view>
			
			<view class="agree-box">
				<view class="total">
					<view class="total-a">商品总计</view>
					<view class="total-b">共计{{num}}件</view>
					<view class="total-c">￥{{price*num}}</view>
				</view>
				<!-- <view class="money">
					<view class="money-a">订单运费</view>
					<view class="money-b">免运费</view>
				</view> -->
				<view class="agree">
					<checkbox-group @change="checkboxChange">
						<label>
							<checkbox value="agree" color='#006eff' style="transform:scale(0.7)" :checked="check"/>
						</label>
					</checkbox-group>
					<view class="agree-con">同意购买协议</view>
				</view>
			</view>
			
		</view>
		
		<view class="pay-foot">
			<view class="pay-left">
				<view class="pay-l1">应付：</view>
				<view class="pay-l2">￥{{price*num}}</view>
			</view>
			<view class="pay-right" style="text-align: center;" @tap="goPayment">确认支付</view>
		</view>
		<Modal 
			v-model="show1"
			title='温馨提示'
			text="还没登录是否前往登录?"
			confirm-text='立即前往'
			@cancel="cancel()"
			@confirm='confirm()'
		/>
		
	</view>
</template>

<script>
	let App = getApp();
	import Modal from '@/components/x-modal/x-modal'
	export default{
		data(){
			return{
				// path:false
				list:[],
				num:1,
				infoImg:'',
				price:0,
				userName:'',
				provinceName:'',
				cityName:'',
				countyName:'',
				detailInfo:'',
				telNumber:'',
				check:false,
				show1:false,
			}
		},
		// computed:{
		// 	// ...mapGetters(['defaultPath'])
		// },
		onLoad(options){
			console.log(options)
			this.getGoods(options.id)
			this.num = options.num
			// console.log(this.num)
			//如果有默认地址的一个赋值，数组大于0,打印下标0 
			// if(this.defaultPath.length){
			// 	// console.log( this.defaultPath[0] );
			// 	this.path = this.defaultPath[0];
			// }
			
			// //如果触发自定义事件，on去接收值
			// uni.$on("selectPathItem",(res)=>{
			// 	// console.log(res);
			// 	this.path = res;
			// })
		},
		// onUnload(){
		// 	// uni.$off('selectPathItem',()=>{
		// 	// 	console.log('移除了selectPathItem');
		// 	// })
		// },
		components:{
			Modal
		},
		methods:{
			goPathList(){
				uni.navigateTo({
					url:('/pages/my-config/my-path-list')
				})
			},
			confirm(){
				uni.navigateTo({
					url:'/pages/mine/login/login'
				})
			},
			cancel(e){
				this.show1= false
			},
			checkboxChange(e){
				this.check = !this.check
				console.log(this.check)
			},
			getGoods(id){
				uni.showLoading({
					title:"加载中"
				})
				this.$api.interfaceApi('getGoodsInfo')({
					id:id
				}).then(res=>{
					if(res.code == 200){
						this.list = res.data
						console.log(this.list)
						this.price = res.data.price
						// this.money = this.changeTwoDecimal_f(this.price * this.number)
						this.title = res.data.title
						this.infoImg =  res.data.info_image
						this.image =  res.data.image
					}
					uni.hideLoading()
				})
			},
			
			async chooseAddress(){
				let _this = this
				wx.chooseAddress({
					success (res) {
						_this.userName = res.userName
						_this.provinceName = res.provinceName
						_this.cityName = res.cityName
						_this.countyName = res.countyName
						_this.detailInfo = res.detailInfo
						_this.telNumber = res.telNumber
						_this.address = false
					}
				})
			},
			async goPayment(){
				if(!this.check){
					uni.showToast({
						title:'请同意购买协议！',
						icon:'error'
					})
					return
				}
				
				let userinfo = uni.getStorageSync('userinfo');
				if(!userinfo){
					this.show1 = true
					return
				}
				
				let result = await this.$api.interfaceApi('getPayConfig')({
					user_id:userinfo.id,
					userName:this.userName,
					provinceName:this.provinceName,
					cityName:this.cityName,
					countyName:this.countyName,
					detailInfo:this.detailInfo,
					telNumber:this.telNumber,
					number:this.num,
					equipment_id:this.list.id,
					admin_id:App.globalData.sys
				})
				console.log(result);
				
				uni.requestPayment({
					provider:'wxpay',
					timeStamp: result.order.timeStamp,
					nonceStr: result.order.nonceStr,
					package: result.order.package,
					signType: result.order.signType,
					paySign: result.order.paySign,
					success:function(res) {
						uni.switchTab({
							url:'/pages/index/index'
						});
						console.log('success:'+JSON.stringify(res));
					},
					fail:function(err){
						console.log('fail:'+JSON.stringify(err));
					}
				});
				
			},
		}
	}
	
</script>

<style>
	@import url("pay.css");
</style>